import React from 'react';
import {Link} from 'react-router-dom'
// import {addGun,removeGun} from './index.redux';
import {connect} from 'react-redux';
import {addGun,removeGun,addGunAsync} from './index.redux';
import {Redirect} from 'react-router-dom';

@connect((state)=>({num:state.counter}),{addGun,removeGun,addGunAsync})

class App extends React.Component{

    render() {
        const redirectToLogin = <Redirect to='/login' />
        console.log(this.props.isAuth)
        alert(this.props.isAuth)
        // console.log(this.props.num.counter.weapen)
        const app = (
            <div>
                <nav>
                    <ul>
                        <li>
                            <Link to='/home'>促销中心</Link>
                        </li>
                        <li>
                            <Link to='order'>订单中心</Link>
                        </li>
                        <li>
                            <Link to='payment'>支付中心</Link>
                        </li>
                        <li>
                            <Link to='customer'>客户中心</Link>
                        </li>
                    </ul>
                </nav>
                <h6>
                    现在有机关枪
                    {this.props.num}
                    {this.props.num>15?<Redirect to='/payment' />:null}
                    <button onClick={this.props.addGun}>申请武器</button>
                    <button onClick={this.props.removeGun}>上交武器</button>
                    <button onClick={this.props.addGunAsync}>武器拖两天</button>
                </h6>
            </div>
        );
        return this.props.isAuth?app:redirectToLogin
    }
}
//第一个参数：你要什么属性
//第二个是参数：你要什么方法，放到props里，自动dispatch
// @connect(mapStatetoProps,actionCreators)
// const mapStatetoProps = (state)=>{
//     return {num: state}
// };
// const actionCreators = {addGun,removeGun,addGunAsync};
// App = connect(mapStatetoProps,actionCreators)(App);

export default App;
